<template>
  <Layout>
    <div class="row">
      <div class="col-12">
        <div class="page-title-box d-flex align-items-center justify-content-between">
          <div class="page-title-right">
            <b-breadcrumb :items="items" class="m-0"></b-breadcrumb>
          </div>
        </div>
      </div>
    </div>
    <div class="row">
      <div class="col-lg-12">
        <div class="card">
          <div class="card-body">
            <h4 class="card-title title_first">
              万家热线合肥房产
              <span class="title_">house.365jia.cn</span>
              <div class="title_state">
                <div style="display:flex;align-items: center;">
                  <div class="ball"></div>
                  <span>正常</span>
                </div>
              </div>
              <div class="edit">
                <i class="mdi mdi-pencil font-size-18"></i>
                <span>编辑</span>
              </div>
            </h4>
            <div class="info">
              <div class="info_title">
                <div>信源摘要</div>
              </div>
              <div class="col-md-6">
                <div class="info_item">
                  <div class="info_k">单位名称:</div>
                  <div class="info_v">安徽大尺度网络传媒有限公司</div>
                </div>
              </div>
              <div class="col-md-6">
                <div class="info_item">
                  <div class="info_k">网站类型:</div>
                  <div class="info_v">生活服务，房产网站</div>
                </div>
              </div>
              <div class="col-md-6">
                <div class="info_item">
                  <div class="info_k">单位性质:</div>
                  <div class="info_v">企业</div>
                </div>
              </div>
              <div class="col-md-6">
                <div class="info_item">
                  <div class="info_k">加入时间:</div>
                  <div class="info_v">2022-02-05</div>
                </div>
              </div>
              <div class="col-md-6">
                <div class="info_item">
                  <div class="info_k">网站备案:</div>
                  <div class="info_v">皖B2-20070027-1</div>
                </div>
              </div>
              <div class="col-md-6">
                <div class="info_item">
                  <div class="info_k">响应时间:</div>
                  <div class="info_v">1毫秒</div>
                </div>
              </div>
              <div class="info_title">
                <div>信源数据</div>
              </div>
              <div class="col-md-6">
                <div class="info_item">
                  <div class="info_k">采集总数量:</div>
                  <div @click="jump('/datahouse')" class="info_v pointer">4,291</div>
                </div>
              </div>
              <div class="col-md-6">
                <div class="info_item">
                  <div class="info_k">异常数量:</div>
                  <div @click="jump('/log')" class="info_v pointer">65,491</div>
                </div>
              </div>
              <div class="col-md-6">
                <div class="info_item">
                  <div class="info_k">种子数量:</div>
                  <div @click="jump('/spider')" class="info_v pointer">291</div>
                </div>
              </div>
              <div class="col-md-6">
                <div class="info_item">
                  <div class="info_k">关联客户:</div>
                  <div @click="jump('/custom')" class="info_v pointer">12</div>
                </div>
              </div>
              <div class="col-md-6">
                <div class="info_item">
                  <div class="info_k">账号数量:</div>
                  <div @click="jump('/spider')" class="info_v pointer">91</div>
                </div>
              </div>
              <div class="col-md-6">
                <div class="info_item">
                  <div class="info_k">数据接口:</div>
                  <div @click="jump('/interface')" class="info_v pointer">0</div>
                </div>
              </div>
              <div class="info_title">
                <div>信源介绍</div>
              </div>
              <div class="col-md-12">
                <div class="info_item" style="display:flex;">
                  <!-- <div class="info_k" style="min-width: 65px;">信源介绍:</div> -->
                  <div class="info_v" style="margin-left:0;">万家热线立足于合肥本地、服务于广大市民，是万家热线成立之初的宗旨。“关心消费者，关注消费者，帮助消费者，成就消费者，就是成就自己；关心商家，关注商家，帮助商家，成就商家，就是成就自己。”这是万家热线不变的承诺。</div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </Layout>
</template>
<script>
import Layout from "../../layouts/main";
export default {
  components: {
    Layout,
  },
  data () {
    return {
      items: [
        {
          text: "信源管理",
          href: "/#/seed",
        },{
          text: "信源详情",
          active: true,
        },
      ],
    }
  },
  methods: {
    jump(url){
      this.$router.push(url)
    }
  }
}
</script>
<style lang="scss" scoped>
.title_first{
  font-size: 20px;
  font-weight: 600;
  .title_{
    font-size: 1rem;
    margin-left: 5px;
  }
  .title_state{
    display: inline-block;
    font-size: .9rem;
    margin-left: 20px;
    font-weight: normal;
    .ball{
      width: 11px;
      height: 11px;
      margin-right: 4px;
      border-radius: 50%;
      background-color: green;
    }
  }
}
.title_first .edit{
  float: right;
  color: #999999;
  margin-left: 10px;
  cursor: pointer;
  span{
    font-size: .9rem;
    font-weight: normal;
  }
}
.title_second{
  font-size: 16px;
  font-weight: 600;
  span{
    margin: 0 6px;
  }
}
.info{
  display: flex;
  flex-wrap: wrap;
}
.info_title{
  width: 100%;
  padding: 0 12px;
  margin-top: 20px;
  margin-bottom: 5px;
  div{
    font-weight: 600;
    padding-bottom: 5px;
    border-bottom: 1px solid #eeeeee;
  }
}
.info_item{
  margin-bottom: 10px;
}
.info_k{
  color: #999999;
  font-size: 15px;
  display: inline-block;
}
.info_v{
  margin-left: 5px;
  display: inline-block;
}
.changestate{
  display: inline-block;
  margin-right: 10px;
  cursor: pointer;
}
.changestate:nth-of-type(1){
  margin-left: 5px;
}
.pointer{
  color: #3444c1;
}
</style>
